<template>
   <div class="Aoir-error">
      <p>404</p>
      <button @click="GoHome">返回大厅</button>
   </div>
</template>
<script lang="ts" setup >
const GoHome = () => navigateTo('/System')
</script>
<style lang="scss" scoped>
.Aoir-error {
   width: var(--aoir-m-width);
   margin: 0 auto 20px;
   height: 650px;
   background-color: #FFF;
   border-radius: var(--aoir-border-radius);
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   font-size: 120px;
   font-weight: 700;
   color: #f44336;

   button {
      border: 0;
      padding: 10px 18px;
      border-radius: 5px;
      background-color: var(--aoir-color-primary-2);
      color: #FFF;
      font-weight: 600;
      cursor: pointer;
      transition: all .2s;

      &:hover {
         opacity: .8;
      }
   }
}
</style>